<template>
	<view class="apply-container">
		<view class="background">
			<view class="img-box">
				<image src="../../static/优转.png"></image>
			</view>
		</view>
		<view class="store-apply">
			<view class="input-box">
				<view class="label">
					<text>店铺名称</text>
				</view>
				<input type="text" v-model="store.storeName">
			</view>
			<view class="text-box">
				<view class="label">
					店铺描述
				</view>
				<textarea v-model="store.storeDesc"></textarea>
			</view>
			<view class="btn-submit">
				<view class="submit" @click="submit">
					提交
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { mapState } from 'vuex'
	export default {
		data() {
			return {
				store: {
					
				}
			};
		},
		computed: {
			...mapState('module_user', ['userinfo'])
		},
		methods: {
			async submit() {
				this.store.ownerId = this.userinfo.id
				const { data: res } = await uni.$http.post('/stores/user/apply', this.store)
				if(res.code === 200) {
					return uni.$showMsg('申请成功')
				}else {
					return uni.$showMsg(res.msg)
				}
			}
		}
	}
</script>

<style lang="scss">
.apply-container {
	width: 100%;
	height: 100%;
	background-color: #fff;
	.background {
		width: 100%;
		height: 50%;
		display: flex;
		justify-content: center;
		background-color: #2b2d3c;
		.img-box {
			margin-top: 20%;
			width: 100px;
			height: 100px;
			border-radius: 50%;
			overflow: hidden;
			border: #fff solid 4px;
			box-shadow: 0 0 10px #bfa;
			image {
				width: 100%;
				height: 100%;
			}
		}
	}
	.store-apply {
		border-radius: 30px 30px 0 0;
		position: relative;
		top: -50px;
		padding: 30rpx;
		background-color: #fff;
		.input-box {
			display: flex;
			height: 40px;
			align-items: center;
			border-bottom: #f0f0f0 1px solid;
			.label {
				margin-right: 20rpx;
				width: 80px;
				font-weight: bold;
			}
			input {
				flex-grow: 1;
				height: 40px;
			}
		}
		.text-box {
			margin-top: 20rpx;
			.label {
				font-weight: bold;
			}
		}
		textarea {
			width: 100%;
			height: 100px;
			margin-top: 20rpx;
			box-sizing: border-box;
			padding: 20rpx;
			border: 1px solid #f0f0f0;
		}
		.btn-submit {
			padding: 30rpx;
			.submit {
				width: 100%;
				color: #fff;
				height: 40px;
				line-height: 40px;
				text-align: center;
				background-color: aqua;
			}
		}
	}
}
</style>
